<script setup lang="ts">
import { ref } from "vue";
import Master from "./master/index.vue";
import Child from "./child/index.vue";

defineOptions({
  name: "SystemDict"
});

const masterRef = ref();
const childRef = ref();
const selectedDictId = ref(0);
const selectedDictName = ref("");

function handleSelectedDict(row: any) {
  selectedDictId.value = row.id;
  selectedDictName.value = row.name;
}
</script>

<template>
  <div class="main flex">
    <div class="w-5/12">
      <Master ref="masterRef" @handleSelectedDict="handleSelectedDict" />
    </div>
    <div class="ml-3 w-7/12">
      <Child
        ref="childRef"
        :selectedDictId="selectedDictId"
        :selectedDictName="selectedDictName"
      />
    </div>
  </div>
</template>

<script scoped lang="scss"></script>
